<h4>事件</h4>
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
 
  <ng-container matColumnDef="select">
    <th mat-header-cell *matHeaderCellDef>
      <mat-checkbox
        (change)="$event ? masterToggle() : null"
        [checked]="selection.hasValue() && isAllSelected()"
        [indeterminate]="selection.hasValue() && !isAllSelected()"
      >
      </mat-checkbox>
    </th>
    <td mat-cell *matCellDef="let row">
      <mat-checkbox
        (click)="$event.stopPropagation()"
        (change)="$event ? selection.toggle(row) : null"
        [checked]="selection.isSelected(row)"
      >
      </mat-checkbox>
    </td>
  </ng-container>

  <ng-container matColumnDef="name">
    <th mat-header-cell *matHeaderCellDef>姓名</th>
    <td mat-cell *matCellDef="let element">{{ element.name }}</td>
  </ng-container>

  <ng-container matColumnDef="age">
    <th mat-header-cell *matHeaderCellDef>年龄</th>
    <td mat-cell *matCellDef="let element">{{ element.age }}</td>
  </ng-container>

  <ng-container matColumnDef="address">
    <th mat-header-cell *matHeaderCellDef>省份</th>
    <td mat-cell *matCellDef="let element">{{ element.address }}</td>
  </ng-container>

  <ng-container matColumnDef="province">
    <th mat-header-cell *matHeaderCellDef>市区</th>
    <td mat-cell *matCellDef="let element">{{ element.province }}</td>
  </ng-container>

  <ng-container matColumnDef="city">
    <th mat-header-cell *matHeaderCellDef>地址</th>
    <td mat-cell *matCellDef="let element">{{ element.city }}</td>
  </ng-container>

  <ng-container matColumnDef="zip">
    <th mat-header-cell *matHeaderCellDef>邮编</th>
    <td mat-cell *matCellDef="let element">{{ element.zip }}</td>
  </ng-container>

  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
  <tr
    mat-row
    *matRowDef="let row; columns: displayedColumns"
    (click)="selection.toggle(row)"
  ></tr>
</table>